<div class="navbar">
    <div class="navbar-inner navbar-inner-blur">
        <div class="left sliding">
            <a href="#" class="back link"> <i class="icon icon-back"></i>
                <span>返回</span>
            </a>
        </div>
        <div class="center sliding">个人设置</div>
    </div>
</div>
<!-- Pages container, because we use fixed-through navbar and toolbar, it has additional appropriate classes-->
<div class="pages navbar-through toolbar-through">
    <!-- Page, "data-page" contains page name -->
    <div data-page="setting" class="page no-toolbar">
        <!-- Scrollable page content -->
        <div class="page-content setting">
            <div class="content-block">
                <h3>更换头像</h3>
                <div class="default-avatar-list clearfix">
                    <ul>
                        <li class="item-content"><a href="#"><img src="image/setting/avatar-01.png" alt=""></a></li>
                        <li class="item-content"><a href="#"><img src="image/setting/avatar-02.png" alt=""></a></li>
                        <li class="item-content"><a href="#"><img src="image/setting/avatar-03.png" alt=""></a></li>
                        <li class="item-content"><a href="#"><img src="image/setting/avatar-04.png" alt=""></a></li>
                        <li class="item-content"><a href="#"><img src="image/setting/avatar-05.png" alt=""></a></li>
                        <li class="item-content"><a href="#"><img src="image/setting/avatar-06.png" alt=""></a></li>
                        <li class="item-content"><a href="#"><img src="image/setting/avatar-07.png" alt=""></a></li>
                        <li class="item-content"><a href="#"><img src="image/setting/avatar-08.png" alt=""></a></li>
                        <li class="item-content"><a href="#"><img src="image/setting/avatar-09.png" alt=""></a></li>
                    </ul>
                </div> 
            </div>
            <div class="content-block clearfix">
                <a href="#" class="btn btn-gallery"><i class="icon icon-gallery"></i></a>
                <a href="#" class="btn btn-camera"><i class="icon icon-phone-camera"></i></a>
            </div>
            <div class="split-horizontal">&nbsp;</div>
            <div class="content-block">
                <h3>更换主题</h3>
                <div class="theme-list clearfix">
                    <ul>
                        <li data-theme="deepBlue" class="item-content">
                            <img src="image/setting/theme-preview-01.png" alt="">                    
                            <p class="tips">深蓝</p>
                        </li>
                        <li data-theme="dazzlingPurple" class="item-content">
                            <img src="image/setting/theme-preview-02.png" alt="">                    
                            <p class="tips">炫光紫</p>
                        </li>
                        <li data-theme="default" class="item-content">
                            <img src="image/setting/theme-preview-default.png" alt="">                 
                            <p class="tips">星空（默认）</p>
                        </li>
                    </ul>
                </div>
            </div>
            <!-- <div class="content-block">
                <div class="row">
                    <div class="col-100">
                        <div class="flat-button">保存更改</div>
                    </div>
                </div>
            </div> -->
        </div>
    </div>
</div>